<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/kmh.css">
<style>
    /* .boxs{
    overflow:hidden;
} */
.boxs .rank-item clearfix{
    float: left;
}
/* .boxs .comic-item-info{
    float: left;
} */
</style>
  

    <!-- <script src="js/test.js"></script> -->
    
</head>
<body>
    <div id="box">
  <div class="header">
    
        <div class="search_box">
            <form action="http://api.pingcc.cn/cartoon/search/title/"+name+"/1/10"/" method="get" class="search_form">
            <input class="search_input" value="" id="search_input" type="search" name="keyword" placeholder="请输入搜索关键字" autocomplete="off">  
            </form>
            
            <!-- <span class="search_clear_cion"></span> -->
        </div>
        <span class="search_btn">搜索</span>
      </div>
  
      
    <div class="rank-nav" >
        <ul class="clearfix">
           <li class="rank-nav-item" id="t1" >
                <a href="javascript:;">
                    热血</a>
            </li>
            <li class="rank-nav-item" id="t2" >
                <a href="javascript:;">灵异</a>
            </li>
            <li class="rank-nav-item" id="t3" >
                <a href="javascript:;">冒险</a>
            </li>
            <li class="rank-nav-item" id="t4" >
                <a href="javascript:;">穿越</a>
            </li>
            <li class="rank-nav-item" id="t5" >
                <a href="javascript:;">生活</a>
            </li>
            <li class="rank-nav-item" id="t6" >
                <a href="javascript:;">悬疑</a>
            </li>
                <li class="rank-nav-item" id="t7" >
                <a href="javascript:;">少年</a>
            </li>
                <li class="rank-nav-item" id="t8" >
                <a href="javascript:;">修真</a>
            </li>
                <li class="rank-nav-item" id="t9" >
                <a href="javascript:;">真人</a>
            </li>
        </ul>
    </div>
    
    <div class="rank-list">
        <div class="boxs" >
        <div class="rank-item clearfix" >
            <a href="javascript:;">
            <img class="cover" src="img/zl.jpg"  alt="鬼眼狂刀">
        </a>
        </div>
        <div class="comic-item-info" >
            <a class="alla" href="javascript:;">
                <p class="comic-name">鬼眼狂刀</p>
                <p class="comic-author">上条明峰</p>
                <p class="comic-tip">第307话</p>
            </a> 
          <!-- <p class="comic-click-count"></p> --> 
        </div>
        </div>
        <div class="boxs" >
            <div class="rank-item clearfix" >
                <a href="javascript:;">
                <img class="cover" src="img/zl.jpg"  alt="鬼眼狂刀">
            </a>
            </div>
            <div class="comic-item-info" >
                <a class="alla" href="javascript:;">
                    <p class="comic-name">鬼眼狂刀</p>
                    <p class="comic-author">上条明峰</p>
                    <p class="comic-tip">第307话</p>
                </a> 
              <!-- <p class="comic-click-count"></p> --> 
            </div>
            </div>
            <div class="boxs" >
                <div class="rank-item clearfix" >
                    <a href="javascript:;">
                    <img class="cover" src="img/zl.jpg"  alt="鬼眼狂刀">
                </a>
                </div>
                <div class="comic-item-info" >
                    <a class="alla" href="javascript:;">
                        <p class="comic-name">鬼眼狂刀</p>
                        <p class="comic-author">上条明峰</p>
                        <p class="comic-tip">第307话</p>
                    </a> 
                  <!-- <p class="comic-click-count"></p> --> 
                </div>
                </div>
            

         
           
    </div>
  
</div>
</body>
<script src="js/jquery-1.12.4.js"></script>

    <script src="js/kmh.js"></script>
   
</html>